<template>
  <div id="app">
    <router-view />
    <myfooter></myfooter>
    <div class="gotop" v-show="showType" @click="gotopFun"><span class="iconfont icon-wode"></span>打开app</div>
  </div>
</template>
<script>
//引入底部导航条
import myfooter from "@/components/commonh/myfooter";

export default {
  data:function(){
      return{
        showType:false,
      } ;
  },
  components: {
    myfooter,
  },
  mounted(){
    //console.log(16, this.$route)
     window.addEventListener("scroll", this.scrollFun, true);
  },
  methods:{
    scrollFun() {
        //console.log("滚动事件触发了");
        //获取滚动高度
        let scrollTop =
          document.documentElement.scrollTop || document.body.scrollTop;
        //console.log(scrollTop);
        if (scrollTop > 200) {
          this.showType = true;
        } else {
          this.showType = false;
        }
      },
    gotopFun(){
      document.documentElement.scrollTop = document.body.scrollTop = 0;
    }
  }
};
</script>

<style>
/*reset 清除浏览器的默认样式*/
* {
  padding: 0;
  margin: 0;
}
ul,
li {
  list-style: none;
}
a {
  text-decoration: none;
}
.gotop{
    width:100px;
    height:40px;
    background-color:red;
    position: fixed;
    bottom:100px;
    right:0px;
    text-align:center;
    line-height:40px;
    border-radius: 30px 0  0  30px;
    color:#fff;
    opacity: 0.8;
}
/*reset*/
</style>
